<template>
	<view class="feedbackdetail">
		<view class="userfeed">
			<view class="time">
				反馈时间：{{data.time}}
			</view>
			<view class="img" v-if="isshow">
				<image @click="bigImg(getimg(item))" :src="getimg(item)" mode="widthFix"
					v-for="(item,index) in data.url" :key='index'></image>
				<view class="bigimg"  @click="smallImg" v-if="showimg">
					<image :src="bigurl" mode="widthFix"></image>
				</view>
			</view>
			<view class="content">
				{{data.content}}
			</view>

		</view>
		<view class="delete" v-if="data.status == 0">
			<view class="btn" @click="deleteFeed(data.id)">
				删除反馈
			</view>
		</view>
		<view class="userfeed back" v-else>
			<view class="time">
				回复时间：{{data.backtime}}
			</view>
			<view class="img" v-if="isBackshow">
				<image @click="bigImg(getimg(item))" :src="getimg(item)" mode="widthFix" v-for="(item,index) in data.back_url" :key='index'></image>
				<view class="bigimg"  @click="smallImg" v-if="showimg">
					<image :src="bigurl" mode="widthFix"></image>
				</view>
			</view>
			<view class="content">
				{{data.back_content}}
			</view>
		</view>

	</view>
</template>

<script>
	import {
		FeedbackDetail,
		deleteFeed
	} from '../../api/user.js'
	export default {
		data() {
			return {
				id: '',
				data: [],
				isshow: false,
				isBackshow: false,
				showimg: false,
				bigurl: ''
			}
		},
		onLoad(res) {
			this.id = res.id
			this.FeedbackDetail(this.id)

		},
		methods: {
			getimg(url) {
				return this.websiteUrl + url
			},
			Show() {
				console.log()
				if (this.data.img == '') {
					this.isshow = false
				} else {
					this.isshow = true
				}
				if (this.data.back_img == '') {
					this.isBackshow = false
				} else {
					this.isBackshow = true
				}
			},
			bigImg(url) {
				this.bigurl = url
				this.showimg = true
			},
			smallImg() {
				this.showimg = false
			},
			FeedbackDetail(id) {
				FeedbackDetail({
					id: id
				}).then(res => {
					console.log(res)
					this.data = res.data
					this.Show()
				})
			},
			deleteFeed(id) {
				deleteFeed({
					id: id
				}).then(res => {
					console.log(res)
					uni.showToast({
						title: '删除成功',
						icon: 'none'
					})
					setTimeout(() => {
						uni.redirectTo({
							url: '/pages/addFeedback/index'
						})
					}, 1000)
				})
			}
		}
	}
</script>

<style lang="scss">
	.feedbackdetail {
		.userfeed {
			background: #fff;

			.time {
				font-size: 14px;
				padding: 10px 20px;
				border-bottom: 1px solid #efefef;
			}

			.img {
				display: table;
				width: 100%;

				image {
					margin-top: 10px;
					width: 20%;
					margin: 10px 1.5%;

				}
			}

			.bigimg {
				background: #000000b0;
				height: 100vh;
				position: fixed;
				top: 0;
				z-index: 999;
				display: flex;
				align-items: center;

				image {
					width: 100vw;
					margin: 0;
				}
			}

			.content {
				min-height: 100px;
				width: 80%;
				padding: 10px 5%;
				font-size: 14px;
			}
		}

		.back {
			margin-top: 20px;
		}
	}

	.btn {
		font-size: 16px;
	}
</style>
